.SetOperationFlow {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

    &>.List {
        flex: 1;
        height: 100%;
        margin-right: 16px;
        display: flex;
        align-items: center;
        justify-content: center;

        &>.ListData {
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            flex-direction: column;
            overflow: hidden;

            &>.ListItem {
                flex: 1;
                width: 100%;
                margin-bottom: 16px;

                &>div {
                    width: 100%;
                    height: 48px;
                    margin-bottom: 4px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    font-family: ShuHeiTi;
                    font-weight: bold;
                    font-size: 18px;
                    color: #FFFFFF;
                    border-radius: 8px;
                    cursor: pointer;
                    background: rgba(0, 0, 0, 0.35);

                    &.active {
                        background: rgba(64, 76, 152, 1);
                    }
                }
            }

            &>button {
                width: 240px;
            }
        }
    }

    &>.Process {
        flex: 3;
        height: 100%;
        padding: 8px;
        border-radius: 4px;
        background: rgba(0, 0, 0, 0.35);
        display: flex;
        align-items: center;
        justify-content: center;

        .ant-spin-dot-item {
            filter: drop-shadow(1px 1px 1px #262626);
        }


        &>.ProcessTemplate {
            width: 100%;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;

            &>.ProcessTemplate__X6 {
                flex: 1;
                width: 100%;
                margin-bottom: 8px;
                background: #f8f8f8;
            }

            &>.ProcessTemplate__OPTIONS {
                &>button {
                    margin: 0 16px;
                }
            }

            .custom-react-node {
                width: 100%;
                height: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                text-align: center;
                border-radius: 8px;
                background: rgba(95, 149, 255, 0.15);
                border: 1px solid rgba(95, 149, 255, 1);
                backdrop-filter: blur(8px);
                filter: drop-shadow(0 0 1px #262626);
                font-family: ShuHeiTi;
                font-weight: bold;
                font-size: 18px;
                color: #262626;

                &.waring {
                    background: rgba(245, 34, 45, 0.15);
                    border: 1px solid rgba(245, 34, 45, 1);
                }
            }

        }
    }


}